<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>闪屏</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<link rel="stylesheet" href="css/mui.min.css">
		<style>
			#close {
				position: absolute;
				width: 160px;
				left: 50%;
				margin-left: -80px;
				bottom: 15%;
				padding: 10px;
				color: #fff;
				border-color: #fff;
			}
			
			.item-logo {
				width: 100%;
				height: 100%;
				position: relative;
			}
			
			.item-logo a {
				width: 200px;
				height: 200px;
				display: block;
				border: 1px solid #FFFFFF;
				border-color: rgba(255, 255, 255, 0.5);
				text-align: center;
				line-height: 200px;
				border-radius: 50%;
				font-size: 40px;
				color: #fff;
				position: absolute;
				top: 15%;
				left: 50%;
				margin-left: -100px;
			}
			
			.animate {
				position: absolute;
				left: 0;
				bottom: 15%;
				width: 100%;
				color: #fff;
				display: -moz-box;
			}
			
			.animate h2 {
				text-align: center;
				margin-bottom: 20px;
			}
			
			.animate li {
				width: 50%;
				height: 30px;
				line-height: 30px;
				list-style: none;
				font-size: 16px;
				text-align: right;
			}
			
			.animate li:nth-child(3) {
				text-align: left;
				float: right;
			}
			
			.animated {
				-webkit-animation-duration: 1s;
				-webkit-animation-play-state: paused;
				-webkit-animation-fill-mode: both;
			}
			
			.guide-show .bounceInDown {
				-webkit-animation-name: bounceInDown;
				-webkit-animation-play-state: running;
				-webkit-animation-delay: 1s;
				display: block;
			}
			
			.guide-show .bounceInLeft {
				-webkit-animation-name: bounceInLeft;
				display: block;
				-webkit-animation-play-state: running;
			}
			
			.guide-show .bounceInRight {
				-webkit-animation-name: bounceInRight;
				display: block;
				-webkit-animation-play-state: running;
				-webkit-animation-delay: 0.5s;
			}
			
			@-webkit-keyframes bounceInDown {
				0%,
				60%,
				75%,
				90%,
				100% {
					-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
					animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
				}
				0% {
					opacity: 0;
					-webkit-transform: translate3d(0, -3000px, 0);
					transform: translate3d(0, -3000px, 0);
				}
				60% {
					opacity: 1;
					-webkit-transform: translate3d(0, 25px, 0);
					transform: translate3d(0, 25px, 0);
				}
				75% {
					-webkit-transform: translate3d(0, -5px, 0);
					transform: translate3d(0, -5px, 0);
				}
				90% {
					-webkit-transform: translate3d(0, 3px, 0);
					transform: translate3d(0, 3px, 0);
				}
				100% {
					-webkit-transform: none;
					transform: none;
				}
			}
			
			@-webkit-keyframes bounceInLeft {
				0%,
				60%,
				75%,
				90%,
				100% {
					-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
					animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
				}
				0% {
					opacity: 0;
					-webkit-transform: translate3d(-3000px, 0, 0);
					transform: translate3d(-3000px, 0, 0);
				}
				60% {
					opacity: 1;
					-webkit-transform: translate3d(25px, 0, 0);
					transform: translate3d(25px, 0, 0);
				}
				75% {
					-webkit-transform: translate3d(-10px, 0, 0);
					transform: translate3d(-10px, 0, 0);
				}
				90% {
					-webkit-transform: translate3d(5px, 0, 0);
					transform: translate3d(5px, 0, 0);
				}
				100% {
					-webkit-transform: none;
					transform: none;
				}
			}
			
			@-webkit-keyframes bounceInRight {
				0%,
				60%,
				75%,
				90%,
				100% {
					-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
					animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
				}
				0% {
					opacity: 0;
					-webkit-transform: translate3d(3000px, 0, 0);
					transform: translate3d(3000px, 0, 0);
				}
				60% {
					opacity: 1;
					-webkit-transform: translate3d(-25px, 0, 0);
					transform: translate3d(-25px, 0, 0);
				}
				75% {
					-webkit-transform: translate3d(10px, 0, 0);
					transform: translate3d(10px, 0, 0);
				}
				90% {
					-webkit-transform: translate3d(-5px, 0, 0);
					transform: translate3d(-5px, 0, 0);
				}
				100% {
					-webkit-transform: none;
					transform: none;
				}
			}
			
			.mui-btn-warning {
				color: #71cff1 !important;
				font-size: 15px;
				background-color: #FFFFFF;
			}
			
			.mui-badge-huise {
				color: #fff;
				border: 1px solid #fff;
				background-color: #053b49;
				width: 40px;
				text-align: center;
				margin-right: 10px;
				opacity: 0.3;
				height: 20px;
				z-index: 999;
				right: 10px;
				top: 45px;
				position: absolute;
			}
		</style>
	</head>

	<body>
		<span id="jump" class="mui-badge mui-badge-huise">跳过</span>
		<div id="lunbo">

		</div>
		<!--<div id="slider" class="mui-slider mui-fullscreen" style="background-color: white;">
			<div class="mui-slider-group">
				<div class="mui-slider-item">
					<div class="item-logo" style="background-image: url(images/welcome_page/flash1.jpg); background-size: 100%; background-position: left top;">

					</div>
				</div>
				<div class="mui-slider-item">
					<div class="item-logo" style="background-image: url(images/welcome_page/flash2.jpg); background-size: 100%; background-position: left top;">

					</div>
				</div>
				<div class="mui-slider-item">
					<div class="item-logo" style="background-image: url(images/welcome_page/flash3.jpg); background-size: 100%; background-position: left top;">

					</div>
				</div>
				<div class="mui-slider-item">
					<div class="item-logo" style="background-image: url(images/welcome_page/flash4.jpg); background-size: 100%; background-position: left top;">

					</div>
				</div>
				<div class="mui-slider-item">
					<div class="item-logo" style="background-image: url(images/welcome_page/flash5.jpg); background-size: 100%; background-position: left top;">
						<div class="animate">
							<button id='close' class="mui-btn mui-btn-warning mui-btn-outlined">开启健康新生活</button>
						</div>
					</div>
				</div>
			</div>
			<div class="mui-slider-indicator">
				<div class="mui-indicator mui-active"></div>
				<div class="mui-indicator"></div>
				<div class="mui-indicator"></div>
				<div class="mui-indicator"></div>
				<div class="mui-indicator"></div>
			</div>
		</div>-->
		<script src="js/mui.min.js"></script>
		<script type="text/javascript" src="js/xiangyingshi.js"></script>
		<script type="text/javascript" src="js/jquery-3.1.1.js"></script>
		<script type="text/javascript" src="js/scroll.js"></script>
		<script type="text/javascript" src="js/constants.js"></script>

		<script type="text/javascript" src="plugs/moment/moment.min.js"></script>
		<script type="text/javascript" src="js/json_time.js"></script>
		<script type="text/javascript" src="js/art/template-web.js"></script>
		<script type="text/javascript" src="js/qs/qs.art.extend.js"></script>
		<script type="text/javascript" src="js/qs/qs.template.js"></script>

		<script>
			mui.back = function() {};
			mui.plusReady(function() {
				if(mui.os.ios) {
					plus.navigator.setFullscreen(true);
				}
				plus.navigator.closeSplashscreen();
				//type(ggw：广告位、sp：闪屏、xq：小七)

				var lunbo_url = serverAddress + "/api/commerical/app/list?type=sp";
				var html = '<div id="slider" class="mui-slider mui-fullscreen" style="background-color:white;"><div class="mui-slider-group"><div class="mui-slider-item"><div class="item-logo" style="background-image:url(images/welcome_page/flash1.jpg);background-size:100%;background-position:left top;"></div></div><div class="mui-slider-item"><div class="item-logo" style="background-image:url(images/welcome_page/flash2.jpg);background-size:100%;background-position:left top;"></div></div><div class="mui-slider-item"><div class="item-logo" style="background-image:url(images/welcome_page/flash3.jpg);background-size:100%;background-position:left top;"></div></div><div class="mui-slider-item"><div class="item-logo" style="background-image:url(images/welcome_page/flash4.jpg);background-size:100%;background-position:left top;"></div></div><div class="mui-slider-item"><div class="item-logo" style="background-image:url(images/welcome_page/flash5.jpg);background-size:100%;background-position:left top;"><div class="animate"><button id="close" class="mui-btn mui-btn-warning mui-btn-outlined">开启健康新生活</button></div></div></div></div><div class="mui-slider-indicator"><div class="mui-indicator mui-active"></div><div class="mui-indicator"></div><div class="mui-indicator"></div><div class="mui-indicator"></div><div class="mui-indicator"></div></div></div>'
				setTimeout(function() {
					$("#lunbo").html(html);
				}, 150);

				var success = function(data) {
					var value = data.data;
					console.log("SHANPING" + JSON.stringify(data));
					if(value.length == 0) {
						$("#lunbo").html(html);
					}
					if(value) {
						setTimeout(function() {
							$("#lunbo").html("");
						}, 150);
					}
					if(data.result == "success") {
						setTimeout(function() {
							$("#lunbo").processTL(templateRegister.shanping_lunbo, {
								sub: value
							}, 'prepend', function() {
								var slider = mui("#slider");
								slider.slider({
									interval: 5000
								});
								$(".qs-img-lazyload").each(function(i, v) {
									$$.lazyload(v)
								})
								setTimeout(function(e) {
									plus.storage.setItem("lauchFlag", "true");
									plus.navigator.setFullscreen(false);
									plus.webview.currentWebview().close();
								}, 5000)
							});

							mui("body").on("tap", ".item-logo", function() {
								var forwardtype = $(this).attr("data-forward");
								var extras = $(this).attr("data-ext");
								var def = dataConfig_imglunbo["MSG001"];
								console.log(forwardtype);
								if(forwardtype == "1") {
									mui.openWindow({
										url: def.link,
										id: def.link,
										extras: {
											TAB: extras
										},
										show: {
											autoShow: true, //页面loaded事件发生后自动显示，默认为true
											event: 'loaded'
										},
										waiting: {
											autoShow: true, //自动显示等待框，默认为true
										}
									});
								}
							});
						}, 150);
					}
				}
				commonHttpUtilsLUNBO(lunbo_url, "get", {}, success, error, true);

			});
			//立即体验按钮点击事件
			//document.getElementById("close").addEventListener('tap', function(event) {
			//			mui("body").on("tap", "#close", function(e) {
			//				plus.storage.setItem("lauchFlag", "true");
			//				plus.navigator.setFullscreen(false);
			//				plus.webview.currentWebview().close();
			//			}, false);

			document.getElementById("jump").addEventListener("tap", function(e) {
				plus.storage.setItem("lauchFlag", "true");
				plus.navigator.setFullscreen(false);
				plus.webview.currentWebview().close();
			}, false);

			//			{
			//				"result": "success",
			//				"data": [{
			//					"status": "0",
			//					"forwardtype": "1",
			//					"type": "1",
			//					"createdOn": "2018-04-13T01:41:33.634Z",
			//					"_id": "5ad00acd1953a73e604a3e06",
			//					"name": "测试优惠券",
			//					"indexnumber": 1,
			//					"img": "\\assets\\uploads\\single-file-1523588562590.jpg",
			//					"refId": "5ad009ff1953a73e604a3e02",
			//					"starttime": "2018-04-12T16:00:00.000Z",
			//					"stoptime": "2018-05-12T16:00:00.000Z"
			//				}, {
			//					"status": "0",
			//					"forwardtype": "0",
			//					"type": "1",
			//					"createdOn": "2018-04-13T03:06:28.439Z",
			//					"_id": "5ad01eb40a507912e4e6b647",
			//					"name": "测试222",
			//					"indexnumber": 1,
			//					"starttime": "2018-04-12T16:00:00.000Z",
			//					"stoptime": "2018-04-26T16:00:00.000Z",
			//					"img": "\\assets\\uploads\\single-file-1523588787652.jpg",
			//					"__v": 0
			//				}, {
			//					"status": "0",
			//					"forwardtype": "0",
			//					"type": "1",
			//					"createdOn": "2018-04-13T03:05:31.564Z",
			//					"_id": "5ad01e7b0a507912e4e6b644",
			//					"name": "测试1111",
			//					"indexnumber": 2,
			//					"starttime": "2018-04-12T16:00:00.000Z",
			//					"stoptime": "2018-04-29T16:00:00.000Z",
			//					"img": "\\assets\\uploads\\single-file-1523588729767.jpg",
			//					"__v": 0
			//				}]
			//			}
		</script>
	</body>

</html>